<template>
	<view class="minH100v">
		<navbar background="background-image: linear-gradient(to right, #2c6739, #99c043);"
			title="附近和历史" back @onBack="goBack" @topTotalHeight="topTotalHeight"
		></navbar>
		<view class="backColWhite lh90r f28r teAliCenter">
			<view @click="cliTabBtn(0)"
				:class="['disInBlo', 'wPer50', 'poRel', 
					tabIdx == 0 ? 'foWeiBold col2c6739' : ''
				]"
			>
				附近茶室
				<text class="w50r h4r backCol2c6739 poAbs bom0 left50P trTrXn50P"
					v-show="tabIdx == 0"
				></text>
			</view>
			<view @click="cliTabBtn(1)"
				:class="['disInBlo', 'wPer50', 'poRel', 
					tabIdx == 1 ? 'foWeiBold col2c6739' : ''
				]"
			>
				历史记录
				<text class="w50r h4r backCol2c6739 poAbs bom0 left50P trTrXn50P"
					v-show="tabIdx == 1"
				></text>
			</view>
		</view>
		<swiper @change="swiperChaFun" :current="tabIdx"
			:style="'height: ' + 'calc(100vh - ' + calcNum + 'px);'"
		>
			<swiper-item class="overYS">
				<scroll-view scroll-y="true" class="hPer100" @scrolltolower="orderScroll"
					:refresher-enabled="true" @refresherrefresh="orderRefresh" :refresher-triggered="ordertri0"
				>
					<view class="p20r f26r">
						<view class="borRad30r mb20r overHid"
							v-for="(item1, index1) in tesHourseList"
							@click="cliTeaList(item1)" :key="item1.id"
						>
							<view class="h300r poRel">
								<image :src="item1.banZero" mode="aspectFill"
									class="wPer100 hPer100"
								></image>
								<view class="pl10r pr10r colFff poAbs left0 bom0 wPer100 boSiBorBox h120r backCol0a0a0aS5 disFlex aliItCenter">
									<view class="flex1 f24r">
										<view class="disInBlo">
											<view class="f32r mb10r foWeiBold webLiCl1 webBoxOrVer overHid disWebBox">
												{{item1.name}}
											</view>
											<view class="webLiCl1 webBoxOrVer overHid disWebBox">
												营业时间：00:00-24:00
											</view>
										</view>
									</view>
									<view class="backCol99c043 w70r h70r borRad50P f24r teAliCenter boSiBorBox pt15r">
										<image :src="baseUrl + 'iconPhoneWhite.png'" mode="aspectFit"
											class="w40r h40r" @click.stop="cliPhoneWhite(item1.tel)"
										></image>
									</view>
								</view>
							</view>
							<view class="lh90r pl30r pr30r col99c043 backColWhite disFlex"
								@click.stop="openRoomList(item1.openVal, index1, item1.id)"
							>
								<view class="flex1 foWeiBold">
									距我：{{item1.distance}}km
								</view>
								<view class="w200r teAliRight f24r">
									{{
										item1.openVal ? '收起' : '展开'
									}}房间
									<image :src="baseUrl + (item1.openVal ? 'iconTopGreen' : 'iconBottomGreen') + '.png'"
										class="w40r h40r poRel top10r" mode="aspectFit"
									></image>
								</view>
							</view>
							<view class="pl10r pr10r backColWhite">
								<roomList v-if="item1.openVal" @cliUseNow="cliUseNow"
									:roomList="item1.roomList"
									@cliAdvanceReservation="cliAdvanceReservation"
								></roomList>
							</view>
						</view>
					</view>
				</scroll-view>
			</swiper-item>
			<swiper-item class="overYS">
				<scroll-view scroll-y="true" class="hPer100 poRel f26r" @scrolltolower="orderScroll"
					:refresher-enabled="true" @refresherrefresh="orderRefresh" :refresher-triggered="ordertri1"
				>
					<view class="col999 poAbs top50P left50P trTrn50Pn50P" v-if="historyList.length == 0">
						暂无数据
					</view>
					<view class="p20r">
						<view class="borRad30r mb20r overHid h300r poRel"
							@click="cliHistoryFun(item)" v-for="(item, index) in historyList" :key="index"
						>
							<image :src="item.picZero" mode="aspectFill"
								class="wPer100 hPer100"
							></image>
							<view class="w100r h100r backCol99c043 poAbs top5r rig5r borRad50P f20r teAliCenter colFff boSiBorBox pt22r">
								{{item.hour}}小时
								<view>
									起订
								</view>
							</view>
							<view class="pl10r pr10r colFff poAbs left0 bom0 wPer100 boSiBorBox h120r backCol0a0a0aS5 disFlex aliItCenter">
								<view class="flex1 f24r">
									<view class="disInBlo">
										<view class="f32r mb10r foWeiBold webLiCl1 webBoxOrVer overHid disWebBox">
											{{item.name}}
										</view>
										<view class="webLiCl1 webBoxOrVer overHid disWebBox">
											营业时间：00:00-24:00
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</scroll-view>
			</swiper-item>
		</swiper>
		<rightOffPage v-show="rightOffFrame" @closeRightOff="closeRightOff"
			:rightOffObj="rightOffObj" ref="rightOffPage"
		></rightOffPage>
		<advanceBookingPage v-show="advanceBookingFrame" ref="advanceBookingPage"
			@closeAdvanceBooking="closeAdvanceBooking"
			:advanceBookingObj="advanceBookingObj"
		></advanceBookingPage>
	</view>
</template>
<script>
import navbar from '@/components/navbar.vue'
import roomList from '@/components/roomList.vue'
import rightOffPage from '@/components/rightOffPage.vue'
import advanceBookingPage from '@/components/advanceBookingPage.vue'
import { isMemberGetTeaList, isMemberGetTeaRoomList } from '@/utils/api.js'
import { baseUrl, imgNetUrl } from '@/utils/request.js'
export default {
	components: { navbar, roomList, rightOffPage, advanceBookingPage },
	data() {
		return {
			calcNum: 0,
			baseUrl,
			tabIdx: 0,
			ordertri0: false,//detailedList0: [], noMore0: false, page0: 0,
			ordertri1: false,//detailedList1: [], noMore1: false, page1: 0,
			tesHourseList: [],
			historyList: [],
			rightOffFrame: false,
			rightOffObj: {
				topIsWho: 1,
				hourMin: '',
				hourMax: 24,
				tid: '',
				rid: '',
				setMealId: '',
				setMealMoney: 0,
				cardDiscount: '',
				originalCost: ''
			},
			advanceBookingFrame: false,
			advanceBookingObj: {
				topIsWho: 1,
				tid: '',
				rid: '',
				hour: '',
				setMealId: '',
				setMealMoney: 0,
				cardDiscount: '',
				originalCost: ''
			},
		}
	},
	onLoad() {
		this.historyList = uni.getStorageSync('historyRoomList');
		if(this.historyList && this.historyList.length) {
			this.historyList.forEach(item => {
				if(item.pic) {
					item.picZero = imgNetUrl + item.pic.split(',')[0];
				}else {
					item.picZero = '/static/images/logo.png';
				}
			})
			console.log(this.historyList)
		}
	},
	onShow() {
		this.getMyLocation();
	},
	methods: {
		getMyLocation(callBack) {
			let lngAndLat = uni.getStorageSync('lngAndLat');
			if(lngAndLat && lngAndLat.longitude && lngAndLat.latitude) {
				isMemberGetTeaList({
					lng: lngAndLat.longitude, lat: lngAndLat.latitude
				}).then(res1 => {
					if(res1.data && res1.data.length) {
						this.tesHourseList = res1.data;
						this.tesHourseList.forEach(item => {
							item.distance = Number(item.distance).toFixed(2);
							if(item.banner) {
								item.banZero = imgNetUrl + item.banner.split(',')[0];
							}else {
								item.banZero = '/static/images/logo.png';
							}
						})
					}
					if(callBack) callBack();
				})
			}else {
				uni.showModal({
					title: '提示', confirmColor: '#99c043',
					content: '检测到您没打开获取信息功能权限，请到首页点击右上角打开',
					confirmText: '去首页', 
					success: (res1) => {
						if (res1.confirm) {
							uni.switchTab({ url: '/pages/index/index' })
						}
					}
				})
			}
		},
		goBack() {
			uni.navigateBack();
		},
		topTotalHeight(height) {
			// #ifdef MP-WEIXIN
				this.calcNum = height + 45;
			// #endif
			// #ifdef H5
				this.calcNum = 45;
			// #endif
		},
		cliTabBtn(type) {
			if(this.tabIdx != type) {
				this.tabIdx = type;
			}
		},
		swiperChaFun(eee) {
			if (eee.detail.source == 'touch') {
				this.tabIdx = eee.detail.current;
			}
		},
		orderScroll() {
			if(this.tabIdx == 0) {
				
			}else if(this.tabIdx == 1) {
				
			}
		},
		orderRefresh() {
			if(this.tabIdx == 0) {
				if(this.ordertri0) {
					return;
				}else {
					this.ordertri0 = true;
					// setTimeout(() => {
					// 	this.ordertri0 = false;
					// }, 500)
					this.getMyLocation(() => {
						this.ordertri0 = false;
					});
				}
			}else if(this.tabIdx == 1) {
				if(this.ordertri1) {
					return;
				}else {
					this.ordertri1 = true;
					setTimeout(() => {
						this.ordertri1 = false;
					}, 500)
				}
			}
		},
		cliTeaList(item1) {
			uni.navigateTo({
				url: '/pages/index/teahouseDetail?type=1&item1=' + JSON.stringify(item1)
			})
		},
		cliPhoneWhite(item1Tel) {
			uni.makePhoneCall({
				phoneNumber: item1Tel,
				success:res => {
					if(res) console.log(11, res)
				}
			});
		},
		openRoomList(openVal, index1, tid) {
			if(openVal) {
				this.tesHourseList[index1].openVal = false;
				this.$forceUpdate();
			}else {
				isMemberGetTeaRoomList({tid, number: 100}).then(res => {
					if(res.data && res.data.data.length) {
						this.tesHourseList[index1].roomList = res.data.data;
						this.tesHourseList[index1].openVal = true;
						this.$forceUpdate();
					}else {
						uni.showToast({
							title: '该茶室暂无开放房间', icon: 'none', duration: 3000
						})
					}
				})
			}
		},
		cliHistoryFun(item) {
			uni.navigateTo({
				url: '/pages/index/roomDetail?item=' + JSON.stringify(item)
			})
		},
		cliUseNow(tid, rid, hour, cardDiscount, originalCost) {
			this.rightOffObj.tid = tid;
			this.rightOffObj.rid = rid;
			this.rightOffObj.hourMin = hour;
			this.rightOffObj.cardDiscount = cardDiscount;
			this.rightOffObj.originalCost = originalCost;
			this.rightOffFrame = true;
			this.$refs['rightOffPage'].renovateRight();
		},
		closeRightOff() {
			this.rightOffFrame = false;
		},
		cliAdvanceReservation(tid, rid, hour, cardDiscount, originalCost) {
			this.advanceBookingObj.tid = tid;
			this.advanceBookingObj.rid = rid;
			this.advanceBookingObj.hour = hour;
			this.advanceBookingObj.cardDiscount = cardDiscount;
			this.advanceBookingObj.originalCost = originalCost;
			this.advanceBookingFrame = true;
			this.$refs['advanceBookingPage'].renovateColor();
		},
		closeAdvanceBooking() {
			this.advanceBookingFrame = false;
		},
	}
}
</script>
<style>
</style>